<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">

<html lang="en">

<head>
    <style>
        [v-cloak] {
            display: none;
        }
    </style>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>登 录</title>

<!--    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">-->

    <link rel="shortcut icon" type="image/icon" href="/ka/assets/logo/favicon.ico"/>
    <link rel="stylesheet" href="/ka/assets/css/font-awesome.min.css">
    <link rel="stylesheet" href="/ka/assets/css/animate.css">
    <link rel="stylesheet" href="/ka/assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="/ka/assets/css/bootsnav.css">
    <link rel="stylesheet" href="/ka/assets/css/style.css">
    <link rel="stylesheet" href="/ka/assets/css/responsive.css">


</head>

<body>
<section class="signin">
    <div class="container">

        <div class="sign-content" id="app">
            <h2>欢 迎 登 录 睿 戈 记 账</h2>
            <span style="color: red" v-cloak>{{msg}}</span>
            <div class="row">
                <div class="col-sm-12">
                    <div class="signin-form">
                        <form action="login.html">
                            <div class="form-group">
                                <label>帐号</label>
                                <input v-model="loginForm.username" type="text" class="form-control"
                                       placeholder="请输入您的帐号">
                            </div>
                            <div class="form-group">
                                <label>密码</label>
                                <input v-model="loginForm.password" type="password" class="form-control"
                                       placeholder="请输入您的密码">
                            </div>
                        </form>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-sm-12">
                    <div class="signin-password">
                        <div class="password-circle">
                            <div class="single-password-circle">
                                <input type="radio" id="radio01" name="radio">
                                <label for="radio01">
												<span class="round-boarder">
													<span class="round-boarder1"></span>
												</span>记住密码
                                </label>
                            </div>
                            <div class="single-forgot-password-circle text-right">
                                <a href="">密码忘了?</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-sm-12">
                    <div class="signin-footer">
                        <button type="button" class="btn signin_btn signin_btn_two" data-toggle="modal"
                                @click="login()">
                            点 我 登 录
                        </button>
                        <p>
                            还未拥有账户 ?
                            <a href="/ka/toRegister"> 去注册</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>


<script src="/ka/assets/js/jquery.js"></script>
<script src="/ka/assets/js/bootstrap.min.js"></script>
<script src="/ka/assets/js/bootsnav.js"></script>
<script src="/ka/assets/js/jquery.sticky.js"></script>
<script src="/ka/assets/js/custom.js"></script>

</body>

<!--<script src="/assets/js/vue/vue.js"></script>-->
<!--<script src="/assets/js/vue/axios.js"></script>-->
<!--<script src="/assets/js/vue/index.js"></script>-->
<!--<script src="https://cdn.bootcss.com/echarts/3.7.1/echarts.min.js"></script>-->
<script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>

<script th:inline="javascript">

    var app = new Vue({
        el: "#app",
        data: {
            loginForm: {
                username: "",
                password: ""
            },
            from: [[${from}]],
            msg: ''
        },
        methods: {
            login: function () {
                app.msg = '正在登录......';
                axios.post("/ka/oauth/login", {
                    username: this.loginForm.username,
                    password: this.loginForm.password
                }).then(function (response) {
                    if (response.data.flag) {
                        app.msg = "登陆成功!页面即将跳转!";
                        var url = app.from;
                        if ('' === url || url == null) {
                            location.href = 'toIndex';
                        } else {
                            //跳转原来的地址
                            location.href = app.from;
                        }
                    } else {
                        app.msg = '登录失败,用户名或密码错误!';
                    }
                })
            }
        }
    });
</script>

</html>